<template>
	<div class="home">
		<search></search>
		<hot v-if="hotMovies" :hotList="hotMovies" :totalComingMovie="totalComingMovie"></hot>
		<a :href="ad.url">
			<img class="ad" :src="ad.image" />
		</a>
		<day-hot v-if="hotPoints" :hotPoints="hotPoints"></day-hot>
	</div>
</template>

<script>
	import search from './home/search.vue'
	import hot from './home/hot.vue'
	import dayHot from './home/dayHot.vue'
	export default {
		name: 'home',
		components: {
			search,
			hot,
			dayHot
		},
		data() {
			return {
				hotMovies: "",
				ad: "",
				totalComingMovie: "",
				hotPoints: ""
			}
		},
		methods: {
			getAd() {
				this.$http.get("/api/ad").then(res => {
					// console.log(res);
					this.ad = res.data.data.areaFirst;
				})
			},
			getHotList() {
				this.$http.get("/api/locationMovies").then(res => {
					this.hotMovies = res.data.data.ms;
					this.totalComingMovie = res.data.data.totalComingMovie;
				})
			},
			getDayHotList() {
				this.$http.get("/api/GetFirstPageAdvAndNews").then(res => {
					// console.log(res);
					this.hotPoints = res.data.data.hotPoints;
				})
			}
		},
		created() {
			this.getHotList(); // 热播和即将上映
			this.getAd(); // 广告
			this.getDayHotList(); //今日热点和新闻
			
			this.$http.get("https://easy-mock.com/mock/5d65e4b905d30d7155d6a7e0/api/api/locationMovies").then(res=>{
				// console.log(res)
			})
		}
	}
</script>

<style lang="scss" scoped>
	@import "~@/assets/css/common.scss";
	.home {
		a {
			display: block;
			border-bottom: vw(16) solid #f6f6f6;
			font-size: 0;
			.ad {
				width: 100%;
			}
		}
	}
</style>